.black {
  color: var(--pachyderm-black);
}

.captionGrey {
  color: var(--placeholder-grey);
}

.white {
  color: var(--white);
}

.captionText {
  font-family: Montserrat, sans-serif;
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.5rem;
  letter-spacing: 0;
}

.captionTextSmall {
  font-family: Montserrat, sans-serif;
  font-weight: 400;
  font-size: 0.75rem;
  line-height: 1.375rem;
  letter-spacing: 0;
}

.bodyText,
.errorText,
.helpText,
.placeholderText {
  font-family:
    Public Sans,
    sans-serif;
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.437rem;
  letter-spacing: 0.2px;
}

.errorText {
  color: var(--error-red);
}

.helpText {
  font-style: italic;
}

.placeholderText {
  color: var(--placeholder-grey);
}

.fieldText {
  font-family: Montserrat, sans-serif;
  font-weight: 700;
  font-size: 0.75rem;
  line-height: normal;
  letter-spacing: 0;
}

.codeTextLarge,
.codeTextLarge * {
  font-family: Menlo, monospace;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.25rem;
  letter-spacing: 0.32px;
  color: var(--pachyderm-black);
}

.codeText,
.codeText * {
  font-family: Menlo, monospace;
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1rem;
  letter-spacing: 0.24px;
  color: var(--pachyderm-black);
}

.idText,
.idText * {
  font-family: Menlo, monospace;
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.437rem;
  letter-spacing: 0.2px;
  color: var(--pachyderm-black);
}

.codeTextBlock {
  background-color: var(--background-blue-light);
  white-space: nowrap;
  overflow-x: auto;
  padding: 1rem 1.25rem;
  flex: 1;
}
